@charset "utf-8";

.indexFlash a {
  display: block;
  position: relative
}

.indexFlash .item {
  height: 5.88rem;
  position: relative;
  background: center no-repeat;
  background-size: cover;
  transform: scale(1.2);
  transition: all 5s ease
}

.indexFlash .slick-active .item {
  transform: scale(1)
}

.indexFlash .layer {
  position: absolute;
  left: 0px;
  top: 50%;
  width: 100%;
  text-align: center;
  color: #FFF;
}

.indexFlash .layer h2 {
  font-weight: 400;
  font-size: .9rem;
  padding-bottom: .18rem;
  letter-spacing: .1rem;
  position: relative;
  top: 50px;
  transition: all 0.5s ease;
  opacity: 0;
  transition-delay: 0.5s;
  width: 14.6rem;
  margin: 0 auto;
  color: #535353;
  text-align: left;
  margin-bottom: 0.18rem
}

.indexFlash .layer h2:after {
  content: "";
  display: block;
  height: 0.05rem;
  background: url("../image/llinee.svg")center no-repeat;
  background-size: cover;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all .3s ease;
  transition-delay: 1.5s;
  width: 0
}

.indexFlash .slick-active .layer h2:after {
  width: 0.42rem
}

.indexFlash .slick-active .layer h2 {
  opacity: 1;
  top: 0
}

.indexFlash .layer p {
  font-size: .25rem;
  letter-spacing: .03rem;
  position: relative;
  top: 50px;
  transition-property: opacity, top;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  opacity: 0;
  transition-delay: 1s;
  width: 14.6rem;
  color: #535353;
  margin: 0 auto;
  text-align: left
}

.indexFlash .slick-active .layer p {
  top: 0;
  opacity: 1
}

.indexFlash .layer p span {
  font-size: .28rem;
}

.indexPart1 {
  padding-top: .19rem;
  width: 18.85rem;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
}

.indexPart1 ul {
  margin-right: -.25rem;
}

.indexPart1 li {
  float: left;
  margin-right: .18rem;
  margin-bottom: .2rem;
  min-height: 50px;
  position: relative;
  overflow: hidden
}

.indexPart1 li.big {
  width: 12.93rem;
}

.indexPart1 li.small {
  width: 5.74rem;
}

.indexPart1 .imgDiv img {
  width: 100%;
  transition: all 2s cubic-bezier(0.23, 1, 0.32, 1)
}

.indexPart1 li:hover .imgDiv img {
  transform: scale(1.1)
}

.indexPart1 li .imgDiv video {
  transition: all 2.3s cubic-bezier(0.23, 1, 0.32, 1)
}

.indexPart1 li:hover .imgDiv video {
  transform: scale(1.2)
}

.indexPart1 .li_06 {
  height: 6.83rem;
  background: #21cdea;
}

.indexPart1 li:nth-child(odd) {
  clear: left;
}

/**/
.indexPart1 .layer {
  width: 3.70rem;
  height: 2.5rem;
  background: rgba(255, 255, 255, 0.9);
  position: absolute;
  top: 50%;
  left: .45rem;
  padding: 0 .3rem;
}

.indexPart1 .title {
  font-size: .1447rem;
  color: #9fa0a0;
  line-height: .5rem;
  letter-spacing: .02rem;
}

.indexPart1 .shareContainer {
  position: absolute;
  top: 0;
  right: 0
}

.indexPart1 .shareT {
  width: .48rem;
  height: 1.98rem;
  background: url("../image/shareT.png") no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  right: 0rem;
  padding-top: 0.12rem;
  transition: all 0.3s ease;
  padding-right: 0.1rem;
  z-index: -1;
  opacity: 0
}

.indexPart1 .shareContainer.on .shareT {
  z-index: 1;
  opacity: 1;
  right: -.48rem
}

.indexPart1 .shareT a.in {
  width: 0.23rem;
  height: 0.23rem;
  background: url("../image/in.png") no-repeat;
  background-size: cover;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.12rem
}

.indexPart1 .shareT a.wechat {
  display: block;
  width: 0.3rem;
  height: 0.24rem;
  background: url("../image/wechatT.png") no-repeat;
  background-size: cover;
  margin: 0 auto;
  margin-bottom: 0.12rem
}

.indexPart1 .shareT a.email {
  display: block;
  width: 0.25rem;
  height: 0.18rem;
  background: url("../image/email.png") no-repeat;
  background-size: cover;
  margin: 0 auto;
  margin-bottom: 0.12rem
}

.indexPart1 a.share {
  display: block;
  width: .5rem;
  height: .5rem;
  background: url(../image/img17.png) center no-repeat;
  background-size: .17rem;
}

.indexPart1 .name {
  font-size: .33rem;
  padding: .18rem 0 .08rem 0;
  padding-top: 0
}

.indexPart1 .i-1 {
  display: block;
  height: .15rem;
  width: .18rem;
  border-top: #a2a2a1 solid .02rem;
}

.indexPart1 p {
  font-size: .2rem;
}

.indexPart1 .li_03 .layer,
.indexPart1 .li_07 .layer {
  left: 2.33rem;
}

/**/
.indexPart1 .layer2 {
  position: absolute;
  left: .7rem;
  top: .5rem;
  color: #FFF;
}

.indexPart1 .layer2 img {
  width: 1.35rem;
}

.indexPart1 .name2 a {
  font-size: 0.6rem;
  padding-top: .43rem;
  font-weight: 100;
  color: #fff;
  display: inline-block
}

.indexPart1 .name2 em.one {
  font-size: 0.3rem
}

.indexPart1 .li_06 .shareContainer {
  width: 0.8rem;
  height: 0.7rem
}

.indexPart1 .li_06 .shareContainer .shareT {
  top: 0;
  left: -0.3rem
}

.indexPart1 .share2 {
  display: block;
  font-size: .1447rem;
  color: #FFF;
  background: url(../image/img17_2.png) right center no-repeat;
  background-size: .17rem;
  padding-right: .28rem;
  height: .7rem;
  line-height: .7rem;
  position: absolute;
  top: 0px;
  right: .3rem;
  width: 0.8rem
}

.indexPart1 li.on .layer {
  -moz-box-shadow: 0 .15rem .3rem rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0 .15rem .3rem rgba(0, 0, 0, 0.3);
  box-shadow: 0 .15rem .3rem rgba(0, 0, 0, 0.3);
  top: 48%;
}

.indexPart1 .li_05.on .layer {
  top: 3.3rem
}

.indexPart1 .li_07.on .layer {
  top: 3rem
}

.indexPart1 .li_08.on .layer {
  top: 3rem
}

@media screen and (min-width:800px) {
  .indexPart1 .li_01 .layer {
    top: 1.60rem;
    left: .55rem;
  }

  .indexPart1 .li_02 .layer {
    top: 1.60rem;
    left: .50rem;
  }

  .indexPart1 .li_03 .layer {
    top: 1.70rem;
    left: 1.50rem;
  }

  .indexPart1 .li_04 .layer {
    top: 1.70rem;
    left: .60rem;
  }

  .indexPart1 .li_05 .layer {
    top: 3.40rem;
    left: .55rem;
  }

  .indexPart1 .li_07 .layer {
    top: 3.10rem;
    left: 1.50rem;
  }

  .indexPart1 .li_08 .layer {
    top: 3.10rem;
    left: .60rem;
  }
}

@media screen and (max-width:800px) {
  .indexFlash1 .item {
    height: 5.69rem;
  }

  .indexFlash1 a {
    display: block;
    position: relative
  }

  .indexFlash1 .item {
    height: 100vw;
    position: relative;
    background: center no-repeat;
    background-size: cover;
    transform: scale(1.2);
    transition: all 5s ease
  }

  .indexFlash1 .slick-active .item {
    transform: scale(1)
  }

  .indexFlash1 .layer {
    position: absolute;
    left: 0px;
    top: 50%;
    width: 100%;
    text-align: center;
    color: #FFF;
  }

  .indexFlash1 .layer h2 {
    font-weight: 400;
    font-size: .9rem;
    padding-bottom: .18rem;
    letter-spacing: .1rem;
    position: relative;
    top: 50px;
    transition: all 0.5s ease;
    opacity: 0;
    transition-delay: 0.5s;
    width: 14.6rem;
    margin: 0 auto;
    color: #535353;
    text-align: left;
    margin-bottom: 0.18rem
  }

  .indexFlash1 .layer h2:after {
    content: "";
    display: block;
    height: 0.05rem;
    background: url("../image/llinee.svg")center no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    bottom: 0;
    transition: all .3s ease;
    transition-delay: 1.5s;
    width: 0
  }

  .indexFlash1 .slick-active .layer h2:after {
    width: 0.42rem
  }

  .indexFlash1 .slick-active .layer h2 {
    opacity: 1;
    top: 0
  }

  .indexFlash1 .layer p {
    font-size: .25rem;
    letter-spacing: .03rem;
    position: relative;
    top: 50px;
    transition: all 0.5s ease;
    opacity: 0;
    transition-delay: 1s;
    width: 14.6rem;
    color: #535353;
    margin: 0 auto;
    text-align: left
  }

  .indexFlash1 .slick-active .layer p {
    top: 0;
    opacity: 1
  }

  .indexFlash1 .layer p span {
    font-size: .28rem;
  }

  .indexPart1 {
    padding-top: 0;
    width: 100%;
    max-width: 450px;
  }

  .indexPart1 ul {
    margin-right: 0;
  }

  .indexPart1 li {
    float: none;
    margin-right: 0;
    margin-bottom: 0;
  }

  .indexPart1 li.big,
  .indexPart1 li.small {
    width: 100%;
  }

  .indexPart1 .li_06 {
    height: 100vw;
  }

  .indexFlash1 .layer h2 {
    left: 0.37rem
  }

  .indexFlash1 .layer p {
    left: 0.37rem
  }

  /**/
  .indexPart1 .layer {
    width: 6.82rem;
    height: 2.4rem;
    left: 50%;
    top: auto;
    bottom: 0.3rem;
    transform: translateX(-50%)
  }

  .indexPart1 li.on .layer {
    top: auto
  }

  .indexPart1 .li_07.on .layer {
    top: auto
  }

  .indexPart1 .li_08.on .layer {
    top: auto
  }

  .indexPart1 .title {
    font-size: .18rem;
    line-height: .65rem;
  }

  .indexPart1 a.share {
    width: .65rem;
    height: .65rem;
  }

  .indexPart1 .name {
    font-size: .4rem;
  }

  .indexPart1 p {
    font-size: .24rem;
  }

  .indexPart1 .li_03 .layer,
  .indexPart1 .li_07 .layer {
    left: 50%;
  }

  /**/
  .indexPart1 .layer2 {
    top: .5rem;
  }

  .indexPart1 .name2 {
    font-size: .59rem;
    padding-top: .25rem;
  }

  .indexPart1 .share2 {
    font-size: .18rem;
    width: 1.2rem
  }
}